<!-- 基础信息 -->

<template>
  <div>
    <FormInput label="模板名称" bind="templateName" :max="20" required />

    <EasyRow col3>
      <FormRadio
        v-if="!INIT_PARAM.templateType"
        label="模板类型"
        bind="templateType"
        :dict="DICT.TYPE"
        initFirst
        required
        @change="changeType"
      />

      <FormRadio
        label="适用对象"
        bind="applyObjectType"
        :dict="DICT.TARGET"
        :disabled="one.templateType === 3"
        initFirst
        required
      />

      <FormTree v-if="one.applyObjectType === 1" v-bind="typeProps" />
      <FormSelect v-else v-bind="typeProps" />
    </EasyRow>

    <FormTextarea label="说明" bind="templateExplain" :max="20" :rows="2" />
  </div>
</template>

<script>
// ============================== 导入依赖 ============================== //

import CORE from '@/CORE'

// ============================== 导出组件 ============================== //

export default {
  /**
   * 名称定义 (实际使用名称)
   */
  name: 'TemplateBase',

  /**
   * 混入列表 (配置选项合并)
   */
  mixins: [CORE.mixWeb()],

  /**
   * 计算属性 (慎用箭头函数)
   */
  computed: {
    /**
     * 类型属性
     */
    typeProps() {
      const { DICT: { TARGET }, one: { applyObjectType }, $root: { device_category_treeDict: categoryDict } } = this

      const label = `${CORE.dict(TARGET, applyObjectType)}类型`
      const bind = 'applyObjectId, applyObjectName, applyObjectCode'
      const dict = applyObjectType === 1 ? categoryDict : CORE.DICT.area_type

      return { label, bind, dict }
    },
  },

  /**
   * 本地方法 (轻量重要在前)
   */
  methods: {
    /**
     * 切换类型
     */
    changeType(type) {
      if (type === 3) this.one.applyObjectType = 2
    },
  },
}
</script>
